<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>动画</title>
	<style type="text/css">
		div{
			width: 400px;
			height: 400px;
			background-image:url('./123.jpg');
		}

	</style>
</head>
<body>
	<div></div>
</body>
<script type="text/javascript" src="./jquery-3.1.1.js"></script>
<script type="text/javascript">
	$('div').click(function(){
		//hide不同参数,效果不一样
		$(this).toggle(5000);
	});
    
	//slideUP(毫秒)收起
	//slideDown(毫秒)放下
	//fadeIn(毫秒)淡出
	//fadeOut(毫秒)淡入
	//delay(毫秒)延时执行
	// $('div').click(function(){
	// 	$(this).delay(3000).slideUp(2000).delay(1000).slideDown(1000);
	// });
	// $('div').click(function(){
	// 	$(this).delay(1000).fadeOut(1000).delay(1000).fadeIn(1000);
	// });
</script>
</html>